![Neovimで編集中のMDN Web Docsのプレビューを開くコマンドを書いた](https://devio2023-media.developers.io/wp-content/uploads/2022/10/eyecatch-neovim-1200x630-1.png)
Neovimで編集中のMDN Web Docsのプレビューを開くコマンドを書いた
どうも。CX事業本部Delivery部のえーたん(@eetann092)です。
筆者は今まで3回MDN Web Docsに翻訳コントリビュートしました。作業中、Neovimからすぐにプレビューを開きたかったため、コマンドを書いてみました。
以下が書いたコマンドを使った例です。
大まかな流れ
処理の大まかな流れは以下です。なお、contentリポジトリのディレクトリでyarn start
を実行中であることが前提です。
- 言語を取得する(例:
ja
) - スラッグを取得する(例:
Mozilla/Add-ons/WebExtensions/API
) - 取得した言語とスラッグをもとに、URLを作成する
- URLをブラウザで開く
指定したURLをブラウザで開く部分は、open-browser.vimを使います。
今回は、以下のようにopen_preview_mdn_web_docs
という関数で実装しました。
local function open_preview_mdn_web_docs(select_language) -- 後で説明 end vim.api.nvim_create_user_command("OpenPreviewMdn", function() open_preview_mdn_web_docs() end, {}) vim.api.nvim_create_user_command("OpenPreviewMdnSelect", function() open_preview_mdn_web_docs(true) end, {})
筆者は開いているファイルが日本語版だったとしても、英語版も確認したいことがありました。そのため、引数で言語選択のあり/無しを指定できるようにし、コマンドも分けています。
言語選択を手動で行う例が以下です。
上記ではnoice.nvimを導入している状態ですので、noice.nvimが入っていない動作例もお見せします。
関数の中身
全体やシンタックスハイライト付きで見たい方は筆者のdotfilesをどうぞ。
ここからは関数の中身を区切って説明していきます。
Markdown判定
まず、Markdown以外ではMarkdown Only
と表示して終了させます。
local port = 5042 local language = nil local fullPath = vim.fn.expand("%:p") if vim.bo.filetype ~= "markdown" then print("Markdown Only") do return end end
言語の選択
次に、言語の選択です。引数で指定した言語選択のあり/無しを使って分岐します。
if select_language then -- 手動で言語を選択 -- ...後で説明 else -- パスから言語を取得 language = string.match(fullPath, ".*files/(.-)/") if language == nil then language = "en-US" end end
elseの部分が言語を自動で選択する場合です。言語をパスから取得しています。
言語の手動選択にはvim.ui.select
を使ってみました。キャンセルした場合は終了します。
-- 手動で言語を選択 vim.ui.select({ "English", "Japanese", "French" }, { prompt = "Select language:", }, function(choice) if choice == "English" then language = "en-US" elseif choice == "Japanese" then language = "ja" elseif choice == "French" then language = "fr" end end) -- 選択をキャンセルした場合は終了 if language == nil then print("See you") do return end end
slugの取得
slugはMarkdownファイルのフロントマターから取得します。10行以内に無かったら諦める仕様です。
local slug = "" local file = io.open(fullPath, "r") if file == nil then do return end end local count = 1 for line in file:lines() do local cap = string.match(line, "slug: (.*)") if cap ~= nil then slug = cap break end count = count + 1 if 10 < count then break end end file:close()
最後に、URLを生成してopen-browser.vimを使って開きます。
local url = string.format("http://localhost:%d/%s/docs/%s", port, language, slug) vim.cmd(string.format("OpenBrowser %s", url))
最後に
今回はcontentリポジトリでyarn start
を実行していることが前提でまだ完全に自動ではありませんが、以前よりも作業が楽になりました。ブラッシュアップしたら随時更新します。
全体やシンタックスハイライト付きで見たい方は筆者のdotfilesをどうぞ。